// import QtQuick 1.0 // to target S60 5th Edition or Maemo 5
import QtQuick 1.1
import com.nokia.meego 1.0
import "../parts/"
import "../js/core.js" as Core

Page{

    tools: personTools
    anchors.fill: parent

    Rectangle{
        anchors.fill: parent
        color: "#e1ecef"

    }
    Flickable{
        id: flick
        width: parent.width; height: parent.height-titlebar.height
        contentWidth: parent.width;
        contentHeight: 700
        anchors.top: titlebar.bottom

        Item{
            id:people
            anchors.top: parent.top
            anchors.bottom: parent.bottom
            width: parent.width; height: parent.height
            Person{
                id: person
                anchors.top: parent.top
                anchors.topMargin: 10
                height:240
            }

            Rectangle {
                height: 360
                width: 360
                anchors.top: person.bottom
                anchors.topMargin: 40
                anchors.horizontalCenter: parent.horizontalCenter
                color: "#00000000"

                Image{
                    anchors.fill: parent
                    source: "qrc:/violet/grid"
                }

                BarChart{
                    id: chart
                    anchors.centerIn: parent
                    height: 300
                    width: 200
                }
            }
        }

    }
    //Page layout is divided in 3
    TitleBar{
        id: titlebar
    }


    ToolBarLayout {
        id: personTools
        Rectangle{
            color:"#8f00FF"
            anchors.fill: parent
        }
        ToolIcon {
            platformIconId: "toolbar-list"
            anchors.left: parent.left
            onClicked: pageStack.push(Qt.resolvedUrl("KarmaListPage.qml"))
        }
        ToolIcon {
            platformIconId: "toolbar-view-menu"
            anchors.right: (parent === undefined) ? undefined : parent.right
            onClicked: (karmaMenu.status === DialogStatus.Closed) ? karmaMenu.open() : karmaMenu.close()
        }
    }

    Menu {
        id: karmaMenu
        MenuLayout {
            MenuItem {
                text: qsTr("Settings")
                onClicked:settings.open()
            }
            MenuItem {
                text: qsTr("Help")
                onClicked:pageStack.push(Qt.resolvedUrl("HelpPage.qml"))
            }
            MenuItem {
                text: qsTr("About")
                onClicked:about.open()
            }
        }
    }

    AboutPage {
        id: about
    }

    HelpPage {
        id: help
    }

    SettingsForm {
        id: settings
        onAccepted: {
                var item = Core.defaultUserItem();

                item.name = settings.name;
                item.image = settings.image;
                item.id=1
                Core.updateUser(item);
                updateUi();
            }

    }

    onStatusChanged: {
        if(status == PageStatus.Activating) {
            chart.getKarma();
        }
    }

    Component.onCompleted: {
        updateUi();
    }

    function updateUi() {
        var item = Core.readUserItem(1);
        person.name=item.name
        person.source=item.image
    }


}
